<template>
  <table-form-dialog v-model="visible"
                     width="500px"
                     title="回单"
                     @close="close"
                     @container="container">
    <div class="dialog-box">
      <el-form ref="ruleForm"
               :model="form"
               label-width="100px"
               class="demo-ruleForm">
        <el-form-item label="回单日期">
          <el-date-picker v-model="form[transport ? 'receiptAt' : 'receiptTime']"
                          default-time="23:59:59"
                          type="datetime"
                          format="yyyy-MM-dd HH:mm"
                          :picker-options="pickerOptions"
                          placeholder="选择日期" />
        </el-form-item>
        <el-form-item label="异常"
                      prop="region">
          <el-radio v-model="form[transport ? 'receiptType' : 'exceptionStatus']"
                    :label="0">无</el-radio>
          <el-radio v-model="form[transport ? 'receiptType' : 'exceptionStatus']"
                    :label="1">补单</el-radio>
        </el-form-item>
        <el-form-item label="回单说明"
                      prop="">
          <el-input v-model="form.receiptDesc"
                    type="textarea"
                    maxlength="200"
                    show-word-limit></el-input>
        </el-form-item>
      </el-form>
    </div>
  </table-form-dialog>
</template>

<script>
import TableFormDialog from "@components/dialog/Dialog";
import { returnHourMinute } from "@/libs/util.js";
import { mapState } from "vuex";

export default {
  name: "ReceiptDialog",
  components: { TableFormDialog },
  props: {
    id: Number,
    receiptAttachList: {
      type: Array,
      default: () => []
    },
    goodsQuantity: {
      type: Array,
      default: () => []
    },
    syncUpAttachments: {
      type: Array,
      default: () => []
    },
    receiptSignTime: [String, Date],
    api: {
      type: Function,
      default: () => { }
    },
    transport: {
      type: Boolean,
      default: false
    },
    orderId: {
      type: [String, Number],
      default: null
    }
  },
  computed: {
    ...mapState({
      visible: (state) => state.table.visible
    }),
    postData () {
      return {
        ...this.form
      };
    }
  },
  watch: {
    visible: {
      handler (val) {
        if (val) {
          if (
            this.$moment(this.form.receiptAt).isBefore(this.receiptSignTime)
          ) {
            this.form.receiptAt = this.receiptSignTime;
            this.form.receiptTime = this.receiptSignTime;
          }
        }
      }
    }
  },
  data () {
    return {
      pickerOptions: {
        // 时间选择限制 收货时间
        disabledDate: (time) => {
          return (
            time.getTime() <=
            new Date(
              new Date(this.receiptSignTime).setDate(
                new Date(this.receiptSignTime).getDate() - 1
              )
            ).getTime()
          );
        },
        selectableRange: `00:00:00 - 23:59:59`
      },
      form: {
        receiptAt: this.$moment(new Date()).format("YYYY-MM-DD 23:59"),
        receiptDesc: "",
        receiptType: 0,
        receiptTime: this.$moment(new Date()).format("YYYY-MM-DD 23:59"),
        exceptionStatus: 0
      }
    };
  },
  created () {
    if (this.receiptSignTime) {
      let time = returnHourMinute(
        this.receiptSignTime.substring(11, 13),
        this.receiptSignTime.substring(14, 16),
        true
      );
      this.pickerOptions.selectableRange = `${time}:00 - 23:59:59`;
    }
  },
  methods: {
    changFormData (value) {
      this.ruleForm = value;
    },
    close () {
      this.$store.commit("table/visibleFalse");
    },
    async container () {
      if (this.goodsQuantity.length > 0) {
        this.postData.goodsQuantity = this.goodsQuantity;
        this.postData.waybillId = this.id;
      } else {
        this.postData.id = this.id;
      }
      this.postData.attachments = this.receiptAttachList;
      this.postData.receiptAttachList = this.receiptAttachList;
      this.postData.orderId = this.orderId;
      this.postData.receiptSignTime = this.$moment(this.receiptSignTime).format(
        "YYYY-MM-DD HH:mm:ss"
      );
      this.postData.receiptSignAt = this.$moment(this.receiptSignTime).format(
        "YYYY-MM-DD HH:mm:ss"
      );
      this.postData.syncUpAttachments = this.syncUpAttachments;
      let { code, message } = await this.api(this.postData);
      this.$store.commit("table/visibleFalse");
      this.$message[code === 0 ? "success" : "error"](message);
      // if (code === 0)
      //   window.close();
    }
  }
};
</script>

<style></style>
